4108

21 分钟

#HTML 的 <colgroup> 标签

HTML 的 <colgroup> 元素定义了表格中的一组列,通常包含 <col> 元素来定义列的属性。

如果 <colgroup> 元素包含 <col> 元素,则 <colgroup> 元素的 span 属性失效。

#属性

  • span: 指定 <col> 元素跨列的连续列数。该值必须是大于 0 的正整数。如果不存在,其默认值为 1。

#示例

  1. 基本示例

    <table> <!-- 定义列组 --> <colgroup> <col style="background-color: pink"> <col style="background-color: lightblue"> <col style="background-color: lightgreen"> <col style="background-color: yellow"> </colgroup> <caption>2023年员工工资表</caption> <thead> <tr> <th>姓名</th> <th>基本工资</th> <th>奖金</th> <th>实发工资</th> </tr> </thead> <tbody> <tr> <td>张三</td> <td>8,000</td> <td>1,200</td> <td>9,200</td> </tr> <tr> <td>李四</td> <td>7,500</td> <td>1,000</td> <td>8,500</td> </tr> </tbody> </table>
    <colgroup>
    2023年员工工资表
    姓名 基本工资 奖金 实发工资
    张三 8,000 1,200 9,200
    李四 7,500 1,000 8,500

  2. span 属性跨列示例:

    <table> <!-- 定义列组 --> <colgroup span="4" style="background-color: pink"> <!-- 不能包含 col 元素 --> </colgroup> <caption>2023年员工工资表</caption> <thead> <tr> <th>姓名</th> <th>基本工资</th> <th>奖金</th> <th>实发工资</th> </tr> </thead> <tbody> <tr> <td>张三</td> <td>8,000</td> <td>1,200</td> <td>9,200</td> </tr> <tr> <td>李四</td> <td>7,500</td> <td>1,000</td> <td>8,500</td> </tr> </tbody> </table>
    <colgroup>
    2023年员工工资表
    姓名 基本工资 奖金 实发工资
    张三 8,000 1,200 9,200
    李四 7,500 1,000 8,500

创建于 2025/5/22

更新于 2025/6/6